<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="./../../resources/templates/baseTemplate.xhtml">
    <ui:define name="header">
        <h:outputScript library="scripts" name="jquery.maskedinput-1.3.min.js" />
        <script type="text/javascript">
            $(function(){
                
                // Adicionando as máscaras nos campos de telefone
                $("#frmNovo\\:itNovoTelefonePrestadorServico").mask("(99)9999-9999");
                $("#frmEditar\\:itEditarTelefonePrestadorServico").mask("(99)9999-9999");
                
                // Adicionando as máscaras nos campos de cnpj
                $('#frmNovo\\:itNovoCnpjPrestadorServico').mask("99.999.999/9999-99");
                $('#frmEditar\\:itNovoCnpjPrestadorServico').mask("99.999.999/9999-99");
            });
        </script>
    </ui:define>
    <ui:define name="content">
        <f:view id="vRoot">
            <p:fieldset legend="Gerenciar prestador de serviço">
                <h:form id="frmPrestadorServicos">
                    <!-- Exibição de mensagens gerais -->
                    <p:growl id="gMessages" sticky="false" globalOnly="true" />

                    <!-- Exibição da lista de prestadores de serviço -->
                    <p:dataTable id="dtPrestadorServicos" 
                                 value="#{prestadorServicoBean.listaPrestadorServico}"
                                 paginator="true" rows="5" 
                                 rowsPerPageTemplate="5,10"
                                 paginatorPosition="bottom"
                                 paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                                 var="atual">

                        <f:facet name="header">
                            <p:commandButton id="cbViewNovo" 
                                             value="Novo" type="button" 
                                             styleClass="cbViewNovo" 
                                             onclick="dlgNovo.show();"
                                             update=":dlgNovoPrestadorServico"
                                             process="@this">
                                <!-- <p:resetInput target=":dlgNovoPrestadorServico"/> -->
                            </p:commandButton>
                        </f:facet>
                        <!-- Colunas de edição e exclusão -->
                        <p:column>
                            <f:facet name="header">
                                <h:outputLabel value="Editar"/>
                            </f:facet>
                            <p:commandButton id="cbViewEditar"  
                                             image="ui-icon-pencil" 
                                             title="Editar"
                                             update=":frmEditar:pEditarPrestadorServico"
                                             oncomplete="dlgEditar.show();">
                                <f:setPropertyActionListener value="#{atual}" 
                                                             target="#{prestadorServicoBean.prestadorServicoSelecionado}" />
                            </p:commandButton>
                        </p:column>
                        <p:column>
                            <f:facet name="header">
                                <h:outputLabel value="Excluir"/>
                            </f:facet>
                            <p:commandButton id="cbViewExcluir" 
                                             onclick="dlgExcluir.show();" 
                                             icon="ui-icon-close" 
                                             title="Excluir">
                                <f:setPropertyActionListener value="#{atual}"
                                                             target="#{prestadorServicoBean.prestadorServicoSelecionado}" />
                            </p:commandButton> 
                        </p:column>
                        <p:column styleClass="tableTitleWidth">
                            <f:facet name="header">
                                Prestador de serviço
                            </f:facet>
                            <h:outputLabel id="olViewPrestadorServicoNome" 
                                           value="#{atual.nmePrestadorServico}"
                                           styleClass="t2 wrap"/>
                            <p:separator />
                            <h:outputLabel value="Telefone: "
                                           styleClass="t3"/>
                            <h:outputLabel id="olViewTelPrestadorServico" 
                                           value="#{atual.telPrestadorServico}"
                                           /> <br/>
                            <h:outputLabel value="Cnpj: " 
                                           styleClass="t3"/>
                            <h:outputLabel id="olViewCodCnpjPrestadorServico" 
                                           value="#{atual.codCnpjPrestadorServico}"/><br/>
                            <h:outputLabel value="Email: "
                                           styleClass="t3"/>
                            <h:outputLabel id="olViewEmlPrestadorServico" 
                                           value="#{atual.emlPrestadorServico}" />
                        </p:column>
                    </p:dataTable>
                </h:form>
                <!-- Caixa de diálogo de inclusão -->
                <p:dialog id="dlgNovoPrestadorServico" 
                          widgetVar="dlgNovo" 
                          modal="true" 
                          header="Novo prestador de serviço"
                          resizable="false">
                    <h:form id="frmNovo">
                        <p:panel id="pNovoPrestadorServico">
                            <p:messages id="mNovoMessages" redisplay="false" />
                            <p:panelGrid columns="2">
                                <p:outputLabel id="olNovoNomePrestadorServico" value="Nome:" for="itNovoNomePrestadorServico"/>
                                <p:inputText id="itNovoNomePrestadorServico" 
                                             value="#{prestadorServicoBean.nome}" 
                                             required="true"
                                             requiredMessage="Digite o nome do prestador de serviço."
                                             maxlength="80"/>

                                <p:outputLabel id="olNovoTelefonePrestadorServico" 
                                               value="Telefone:" 
                                               for="itNovoTelefonePrestadorServico"/>
                                <p:inputText id="itNovoTelefonePrestadorServico" 
                                             value="#{prestadorServicoBean.telefone}" 
                                             required="true"
                                             requiredMessage="Digite o telefone do prestador de serviço."
                                             maxlength="14"/>

                                <p:outputLabel id="olNovoCnpjPrestadorServico" 
                                               value="Cnpj:" 
                                               for="itNovoCnpjPrestadorServico"/>
                                <p:inputText id="itNovoCnpjPrestadorServico" 
                                             value="#{prestadorServicoBean.cnpj}" 
                                             required="true"
                                             requiredMessage="Digite o Cnpj do prestador de serviço."
                                             maxlength="30"
                                             validatorMessage="Digite um Cnpj válido.">
                                    <f:validator validatorId="cnpjValidador" />
                                </p:inputText>

                                <p:outputLabel id="olNovoEmlPrestadorServico" value="Email:" for="itNovoEmlPrestadorServico"/>
                                <p:inputText id="itNovoEmlPrestadorServico" 
                                             value="#{prestadorServicoBean.eml}" 
                                             required="true"
                                             requiredMessage="Digite o e-mail do prestador de serviço."
                                             validatorMessage="Digite um email válido."
                                             maxlength="80">
                                    <f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
                                </p:inputText>


                                <p:commandButton value="Cancelar" immediate="true" onclick="dlgNovo.hide()"/>
                                <p:commandButton id="cbNovoSalvar" value="Salvar" 
                                                 actionListener="#{prestadorServicoBean.cadastrarPrestadorServico}"
                                                 oncomplete="handleSalvo(xhr, status, args);" 
                                                 update=":frmPrestadorServicos:dtPrestadorServicos :frmNovo :frmPrestadorServicos:gMessages"
                                                 ajax="true"/>
                            </p:panelGrid>
                        </p:panel>
                    </h:form>
                </p:dialog>
                <!-- Caixa de diálogo de exclusão -->
                <p:confirmDialog id="dialogoExcluir" message="Deseja realmente excluir?"
                                 header="Excluir prestador de serviço" severity="alert" 
                                 widgetVar="dlgExcluir">
                    <h:form id="frmExcluir">
                        <p:commandButton id="cbExcluirCancelar" value="Cancelar" 
                                         onclick="dlgExcluir.hide()" 
                                         type="button" /> 
                        <p:commandButton id="cbExcluirContinuar" value="Continuar"
                                         update=":frmPrestadorServicos:dtPrestadorServicos :frmPrestadorServicos:gMessages" 
                                         oncomplete="dlgExcluir.hide()"
                                         actionListener="#{prestadorServicoBean.excluirPrestadorServico}"/>
                    </h:form>
                </p:confirmDialog>
                <!-- Caixa de diálogo de edição -->
                <p:dialog id="dialogoEditar" 
                          widgetVar="dlgEditar" 
                          header="Editar prestador de serviço"
                          resizable="false" 
                          modal="true">
                    <h:form id="frmEditar">
                        <p:panel id="pEditarPrestadorServico">
                            <p:messages id="mEditarMessages" 
                                        redisplay="false" />
                            <p:panelGrid columns="2">
                                <p:outputLabel id="olEditarNomePrestadorServico" 
                                               value="Nome:" 
                                               for="itEditarNomePrestadorServico"/>
                                <p:inputText id="itEditarNomePrestadorServico" 
                                             value="#{prestadorServicoBean.prestadorServicoSelecionado.nmePrestadorServico}" 
                                             required="true"
                                             requiredMessage="Digite o nome do prestador de serviço."
                                             maxlength="80"/>

                                <p:outputLabel id="olEditarTelefonePrestadorServico" 
                                               value="Telefone:" 
                                               for="itEditarTelefonePrestadorServico"/>
                                <p:inputText id="itEditarTelefonePrestadorServico" 
                                             value="#{prestadorServicoBean.prestadorServicoSelecionado.telPrestadorServico}" 
                                             required="true"
                                             requiredMessage="Digite o telefone do prestador de serviço."
                                             maxlength="14"/>

                                <p:outputLabel id="olEditarCnpjPrestadorServico" 
                                               value="Cnpj:" 
                                               for="itEditarCnpjPrestadorServico"/>
                                <p:inputText id="itEditarCnpjPrestadorServico" 
                                             value="#{prestadorServicoBean.prestadorServicoSelecionado.codCnpjPrestadorServico}" 
                                             required="true"
                                             requiredMessage="Digite o CNPJ do prestador de serviço."
                                             maxlength="30"/>

                                <p:outputLabel id="olEditarEmailPrestadorServico" 
                                               value="Email:" 
                                               for="itEditarEmailPrestadorServico"/>
                                <p:inputText id="itEditarEmailPrestadorServico" 
                                             value="#{prestadorServicoBean.prestadorServicoSelecionado.emlPrestadorServico}" 
                                             required="true"
                                             requiredMessage="Digite o e-mail do prestador de serviço."
                                             maxlength="80">
                                    <f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
                                </p:inputText>


                                <p:commandButton value="Cancelar" immediate="true" 
                                                 onclick="dlgEditar.hide()"/>
                                <p:commandButton id="cbEditarSalvar" 
                                                 value="Salvar" 
                                                 actionListener="#{prestadorServicoBean.alterarPrestadorServico}"
                                                 oncomplete="handleEditar(xhr, status, args);" 
                                                 update=":frmPrestadorServicos :frmEditar"/>
                            </p:panelGrid>
                        </p:panel>
                    </h:form>
                </p:dialog>
            </p:fieldset>
        </f:view>
        <!-- Javascript responsável por fechar a caixa de diálogo ao cadastrar-->
        <script type="text/javascript">
            function handleSalvo(xhr, status, args){
                if(args.salvo){
                    dlgNovo.hide();
                }
            }
            function handleEditar(xhr, status, args){
                if(args.editado){
                    dlgEditar.hide();
                }
            }
        </script>
    </ui:define>
</ui:composition>
